/**
 * Created by jameswatt2008 on 2017/6/5.
 */

function animate(div, obj, fn) {
    //console.log(cb)

    //{left:100;top:200}
    //{left:100}
    //{left:100}
    clearInterval(div.timer);

    div.timer = setInterval(function () {
        var flag = true;//假设已经到了目的地
        //1-0.5
        //100  50
        for (var key in obj) {
            // console.log(key)//left   top   getStyle['left']
            // console.log(obj[key])//300


            //0.1
            //11
            //0.1
            //10/8  1.1   1          0.1
            var target = obj[key];
            if (key == 'opacity') {
                var speed = (target - parseFloat(getComputedStyle(div)[key])) * 100 / 8;
                // console.log(speed,'speed1')
                speed = (speed > 0 ? Math.ceil(speed) : Math.floor(speed));
                //console.log(speed,'speed2')

                var op = parseFloat(getComputedStyle(div)[key]) + speed / 100;
                // console.log(op)

                div.style[key] = op;
                if (parseFloat(getComputedStyle(div)[key]) != target) {
                    flag = false;
                }

            } else {
                var speed = (target - parseInt(getComputedStyle(div)[key])) / 8;
                speed = (speed > 0 ? Math.ceil(speed) : Math.floor(speed));
                div.style[key] = parseInt(getComputedStyle(div)[key]) + speed + 'px';
                if (parseInt(getComputedStyle(div)[key]) != target) {
                    flag = false;
                }
            }





        }

        //必须等到所有的 属性都到达目的地 才能结束定时器
        if (flag == true) {
            clearInterval(div.timer);
            if (fn) {
                fn()
            }

        }

    }, 30);


}